<script setup lang='ts'>
import InvestmentPortfolio from "./InvestmentPortfolio/InvestmentPortfolio.vue"
import { usePortfolioRebalancings } from "./hook/PortfolioRebalancings";
import { PureTableBar } from "@/components/RePureTableBar";
const {
  Ttimes,
  dataList,
  loading,
  btnloading,
  pagination,
  columns,
  PropData,
  dataLists,
  TimesVisible,
  DialogVisible,
  OptimizeVisible,
  suTimes,
  disabledDate,
  closesuTimes,
  optimizeReport,
  handleSizeChange,
  handleCurrentChange
} = usePortfolioRebalancings();
const columnss = [
  {
    label: "本金(元)",
    prop: "principal"
  }, {
    label: "购买日期",
    prop: "purchaseTime",
  }, {
    label: "分析日期",
    prop: "analyseTime"
  }, {
    label: "持仓时间(天)",
    prop: "holdingTime",
  }, {
    label: "持仓波动率(%)",
    prop: "positionVolatility"
  }, {
    label: "持仓收益率(%)",
    prop: "positionYield"
  }, {
    label: "持仓收益(元)",
    prop: "positionGain"
  },
]
</script>
<template>
  <div class="main">
    <!-- -- 投资者--投资组合再平衡 -->
    <PureTableBar class="list_hei">
      <template v-slot="{ size, checkList }">
        <pure-table border align-whole="center" showOverflowTooltip table-layout="auto" :loading="loading" size="small"
          max-height="600" :data="dataList" :columns="columns" :checkList="checkList" :pagination="pagination"
          @size-change="handleSizeChange" @current-change="handleCurrentChange" :header-cell-style="{
            background: 'var(--el-table-row-hover-bg-color)',
            color: 'var(--el-text-color-primary)'
          }">
          <template #operations="{ row }">
            <el-button type="primary" text size="small" @click="optimizeReport(row, 1)"
              :disabled="row.warehouseTransferPrompt == ''"> 一键优化 </el-button>
          </template>
          <template #operation="{ row }">
            <el-button type="primary" text size="small" @click="optimizeReport(row, 2)"> 投资组合分析
            </el-button>
            <el-button type="primary" text size="small" :disabled="!(row.parsingStatus == 2 || row.parsingStatus == 3)"
              @click="optimizeReport(row, 0)"> 查看分析报告 </el-button>
          </template>
        </pure-table>
      </template>
    </PureTableBar>

    <!-- 投资组合选时间 -->
    <ReDialog :width="350" :height="170" :models="TimesVisible" @Closes="closesuTimes()">
      <template #header>
        <h2 style="text-align: center;">选择日期</h2>
      </template>
      <template #main>
        <div class="h-full flex justify-center items-center">
          <el-date-picker v-model="Ttimes" :disabled-date="disabledDate" type="date" />
        </div>
      </template>
      <template #footer>
        <el-button type="primary" @click="suTimes()" :loading="btnloading"> 确定 </el-button>
        <el-button @click="closesuTimes()"> 取消 </el-button>
      </template>
    </ReDialog>
    <!-- 查看分析报告 -->
    <ReDialog :width="750" :height="550" :models="OptimizeVisible" @Closes="OptimizeVisible = false">
      <template #header>
        <h2 style="text-align: center;">一键优化</h2>
      </template>
      <template #main>
        <el-scrollbar height="470px">
          <InvestmentPortfolio v-show="OptimizeVisible" :PropData="PropData.data"
            :portfolioldId="PropData.portfolioldId" />
        </el-scrollbar>
      </template>
    </ReDialog>

    <!-- 投资组合业绩报告 -->
    <ReDialog :width="700" :height="360" :models="DialogVisible" @Closes="DialogVisible = false">
      <template #header>
        <h2 style="text-align: center;">投资组合业绩报告</h2>
      </template>
      <template #main>
        <div class="visible_report">
          <dl class="visible_report_dl">
            <dd>本投资组合基于用户群风险类型与投资需求，进行持仓分配</dd>
            <dd>根据用户群的风险类型和可用资产基金投资组合后，从投资组合开始运行至当前已运行{{ dataLists[0].holdingTime || 0 }}天，期间该投资组合的业绩如下:</dd>
          </dl>
          <pure-table border align-whole="center" showOverflowTooltip table-layout="auto" :loading="loading" size="small"
            max-height="550" :data="dataLists" :columns="columnss" :header-cell-style="{
              background: 'var(--el-table-row-hover-bg-color)',
              color: 'var(--el-text-color-primary)'
            }">
          </pure-table>
          <dl class="visible_report_dl">
            <dt>免责声明:</dt>
            <dd>本投资组合业绩报告仅对持仓期内的业绩进行尽责描述，报告中所有数据均不能
              对持仓期以外的任何时段进行预测和保证。且本报告中所有显示数据，均来源于
              专业市场数据，不存在任何虚构或造假数据来源</dd>
          </dl>
        </div>
      </template>
    </ReDialog>

  </div>
</template>

<style scoped lang="scss">
@import url(@/style/CreditComm.scss);

.visible_report {
  .visible_report_dl {
    text-align: left;
    text-indent: 2rem;
    margin: 10px 0;
  }
}
</style>
